<template>
  <el-dialog :title='titleFont' :visible.sync='isShow' width='700px' :lock-scroll=false :close-on-click-modal=false @close='clearForm("queryForm")'
    @open="openInitializtaion">
    <div v-loading="loading">
      <el-card class='type-info-box-card'>
        <el-form ref='queryForm' size='mini' :model="queryForm" label-width="140px" :rules="rules" label-position="center">
          <el-row :gutter="30">
            <el-col :span='100'>
              <el-form-item label='渠道名称' prop='CHLCODE'>
                <el-select v-model='queryForm.CHLCODE' filterable style="width:350px">
                  <el-option v-for='item in CHLNAMEOpions' :key='item.CHLCODE' :label='item.CHLNAME' :value='item.CHLCODE'>
                  </el-option>
                </el-select>
              </el-form-item>
              <!-- <el-form-item label='交易名称' prop='FLOWID'>
                <el-select v-model='queryForm.FLOWID' filterable style="width:350px">
                  <el-option v-for='item in FLOWNAMEOpions' :key='item.FLOWID' :label='item.FLOWNAME' :value='item.FLOWID'>
                  </el-option>
                </el-select>
              </el-form-item> -->
            </el-col>
            <el-col :span='100' >
                            <el-form-item label='交易名称' prop='handleSelectValue' >
                              <div style="height:40px">
                              </div>
                                <el-transfer  v-model="queryForm.handleSelectValue" :props="{key:'value',label:'desc'}" :data="BUSITYPEPOOL" :titles="['交易列表','已选交易']" filter-placeholder="请选择交易"  style="width:550px;margin-left: -70px; padding-bottom:10px" >
                                </el-transfer>
                            </el-form-item>
                          </el-col>
          </el-row>
          

        </el-form>
      </el-card>
      <div slot="footer" style="margin:10px 0;text-align:center">
        <el-button size="mini" @click="isShow=false">取消</el-button>
        <el-button type='primary' size='mini' @click="submit">确定</el-button>
      </div>
    </div>
  </el-dialog>
</template>

<script>
  import request from "@/common/utils/requestCT";
  import channelTransactionAdd from "@/message/CTManage/channel-transaction/channel-transaction-add";
  import channelTransactionUpdate from "@/message/CTManage/channel-transaction/channel-transaction-update";
  import transactionNameQuery from "@/message/shared/transaction-name-query";
  export default {
    data() {
      return {
        handleSelectValue:[],
        querySkills:[],
        BUSITYPEPOOL:[],
        loading: false,
        titleFont: '渠道对应交易',
        queryForm: { //表单数据
          FLOWID: '',
          CHLCODE: '',
          ID: '',
          handleSelectValue:[]
        },
        rules: { //表单校验规则
          CHLCODE: [{
            required: true,
            message: "请选择渠道名称",
            trigger: "change"
          }],
          FLOWID: [{
            required: true,
            message: "请选择交易名称",
            trigger: "change"
          }]
        }
      };
    },
    props: {
      option: Object
    },
    methods: {
      generateData(){
      const data = [];
      for(let i=0;i<this.querySkills.length;i++){
        data.push({
          value:this.querySkills[i].FLOWID,
          desc:this.querySkills[i].FLOWNAME,
        })
      };
      this.BUSITYPEPOOL=data;
    },
      openInitializtaion() {
        this.titleFont = this.option.font + '渠道对应交易';
        if (!this.option.currentRow.length) return;
        const {
          CHLCODE,
          FLOWID,
          ID
        } = this.option.currentRow[0]
        this.queryForm = {
          CHLCODE,
          FLOWID,
          ID
        }
      },
      submit() {
        //添加策略事件
        this.$refs["queryForm"].validate(valid => {
          if (valid) {
            this.loading = true;
            let resBody;
            if (this.option.isUpdate){
              resBody = new channelTransactionUpdate();
              resBody.data.ID = this.queryForm.ID;
              resBody.data.FLOWID_old= this.option.currentRow[0].FLOWID
             resBody.data.CHLCODE_old=this.option.currentRow[0].CHLCODE
            } else {
              resBody = new channelTransactionAdd();
            }
            resBody.data.FLOWID = this.queryForm.handleSelectValue.toString().replace("\"","").replace("[","").replace("]","");
            resBody.data.CHLCODE = this.queryForm.CHLCODE;
            
             console.log("ff");
             
            request(resBody)
              .then(response => {
                this.loading = false;
                if (response.SYS_HEAD.ReturnCode === "000000") {
                  this.$message({
                    type: "success",
                    message: this.option.isUpdate ? "渠道对应交易更新成功!" : "渠道对应交易新增成功!"
                  });
                  this.isShow = false;
                  this.$emit("refreshTable");
                } else {
                  this.$message({
                    type: "error",
                    message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
                  });
                }
              })
              .catch(error => {
                this.loading = false;
                console.log(error);
              });
          }
        });
      },
      clearForm(item) {
        if (this.$refs.queryForm) {
          this.$refs.queryForm.resetFields();
          this.$refs.queryForm.clearValidate();
        }
      }
    },
    computed: {
      isShow: {
        get: function () {
          return this.option.isShow;
        },
        set: function (newValue) {
          this.option.isShow = newValue;
        }
      },
      CHLNAMEOpions: function () {
        return this.option.CHLNAMEOpions
      },
      FLOWNAMEOpions: function () {
       
        return this.option.FLOWNAMEOpions
      }
    },
    async created() {
           //这里是交易信息查询
      let resBodySkills = new transactionNameQuery();
      resBodySkills.QueryPageNo = this.currentPage;
      resBodySkills.QueryRowNum = this.pageSize;
      let responseSkills = await request(resBodySkills);

      if (responseSkills.SYS_HEAD.ReturnCode == "000000") {
        this.querySkills = responseSkills.RSP_BODY.resultSet;
        this.generateData();
        
      }else {
        this.$message({
            type: "error",
            message: "请求失败，错误码:" + responseSkills.SYS_HEAD.ReturnCode + "，错误信息：" + responseSkills.SYS_HEAD.ReturnMessage
          });
      }
    }
    // mounted() {
    //   window.addEventListener("scroll", this.handleScroll);
    // }
  };

</script>

<style lang="scss" scope>


</style>
